<template>
	<view class="info">
		<!-- 头部 -->
		<image class="info_yy" :src="dataobj.images"></image>
		<!-- 内容 -->
		<view class="info_bos">
			<!-- 标题 -->
			<view class="info_title">
				<image :src="dataobj.logo"></image>
				<view class="info_title_box">
					<view class="font-323232 font-b font15">{{dataobj.name}}</view>
					<view class="info_title_name">{{dataobj.tag}}</view>
				</view>
			</view>
			<view class="info_xx" @click="Onphone(dataobj.tel)">
				<image src="../../static/info/phone.png"></image>
				<view class="font14 font-323232 font-b">{{dataobj.tel}}</view>
			</view>
			<view class="info_xx" @click="onNavigation">
				<image src="../../static/info/addres.png"></image>
				<view class="font14 font-323232 font-b">
					{{dataobj.province_name}}{{dataobj.city_name}}{{dataobj.area_name}}{{dataobj.address}}</view>
			</view>
			<view class="info_border"></view>
			<!-- 精医名院 -->
			<view class="bright">
				<view class="bright_title">
					<view></view>
					<text class="font-323232 font-b font15">精医名院</text>
				</view>
				<view class="bright_info">
					<view class="bright_bos" @click="goNext('/pagesA/common/list?type=info',false)">
						<view class="bright_box">
							<image src="../../static/info/info_a.png"></image>
						</view>
						<view class="font-323232 font15">科室介绍</view>
					</view>
					<view class="bright_bos"@click="goNext('/pagesA/common/list?type=doc',false)">
						<view class="bright_box">
							<image src="../../static/info/info_b.png"></image>
						</view>
						<view class="font-323232 font15">医生介绍</view>
					</view>
					<view class="bright_bos" @click="Onnewslist">
						<view class="bright_box">
							<image src="../../static/info/info_c.png"></image>
						</view>
						<view class="font-323232 font15">医院动态</view>
					</view>
					<view class="bright_bos" @click="goNext('/pagesA/info/distribution',false)">
						<view class="bright_box">
							<image src="../../static/info/info_d.png"></image>
						</view>
						<view class="font-323232 font15">科室分布</view>
					</view>
				</view>
			</view>
			<!-- 本院介绍 -->
			<view class="bright padding_bottom">
				<view class="bright_title">
					<view></view>
					<text class="font-323232 font-b font15">本院介绍</text>
				</view>
				<view class="introduce">
					<rich-text :nodes="dataobj.content"></rich-text>
				</view>
			</view>
		</view>
		<ComTabBar :selected="1"></ComTabBar>
	</view>
</template>

<script>
	import ComTabBar from '@/components/ComTabBar.vue';
	export default {
		components: {
			ComTabBar
		},
		data() {
			return {
				dataobj: {}, //数据
				hospitalinfo: {}, //数据
			}
		},
		onShow: function() {
			wx.hideTabBar()
		},
		onLoad() {
			//接口
			this.Onhttp()

		},
		methods: {
			//接口
			Onhttp() {
				this.$Http({
					url: 'hospital',
					data: {}
				}).then(res => {
					if (res.code == 1) {
						res.data.images = this.$store.state.http_img + res.data.images
						res.data.logo = this.$store.state.http_img + res.data.logo
						res.data.content = res.data.content?res.data.content.replace(/\<img/g,'<img style="display: block;max-width: 100%;height: auto;"'):''
						this.dataobj = res.data
					}
				});
			},
			//导航
			onNavigation() {
				let that = this
				wx.getLocation({ //获取当前经纬度
					type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息
					success: function(res) {
						wx.openLocation({ //​使用微信内置地图查看位置。
							latitude: that.dataobj.lat * 1, //要去的纬度-地址
							longitude: that.dataobj.lng * 1, //要去的经度-地址
							name: that.dataobj.name,
							address: that.dataobj.address
						})
					}
				})
			},
			// 路由跳转: tag默认false,tag=true跳到tabBar页面
			goNext(url, tag) {
				if (tag) {
					uni.switchTab({
						url: url
					});
				} else {
					uni.navigateTo({
						url: url
					});
				}
			},
			//列表页面
			OnmedicineList(e) {
				uni.navigateTo({
					url: '../common/list?type=' + e,
				})
			},
			//科室分布
			Ondistribution() {
				uni.navigateTo({
					url: '/pagesA/info/distribution',
				})
			},
			//医院动态
			Onnewslist() {
				uni.navigateTo({
					url: '/pagesA/info/newslist',
				})
			},
			//拨打电话
			Onphone(e){
				uni.makePhoneCall({
				    phoneNumber: e //仅为示例
				});
			}
		}
	}
</script>

<style>
	page{
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}
	.info {
		width: 750rpx;
		position: relative;
		height: 100%;
	}

	/* 头部图片 */
	.info_yy {
		width: 750rpx;
		height: 312rpx;
	}

	/* 内容 */
	.info_bos {
		position: absolute;
		width: 750rpx;
		border-radius: 30rpx;
		top: 262rpx;
		z-index: 2;
		background-color: #ffffff;
	}

	/* 标题 */
	.info_title {
		display: flex;
		align-items: center;
		padding: 0 30rpx;
		height: 120rpx;
		margin-top: 30rpx;
		margin-bottom: 40rpx;
	}


	.info_title image {
		height: 110rpx;
		width: 100rpx;
		margin-right: 36rpx;
	}


	.info_title_box {
		flex-direction: column;
		display: flex;
		height: 120rpx;
		justify-content: space-around;
	}

	.info_title_name {
		min-width: 10rpx;
		text-align: center;
		border: 1rpx #579c8d solid;
		padding: 6rpx 8rpx;
		color: #579c8d;
		border-radius: 6rpx;
		font-size: 24rpx;
	}

	.info_xx {
		width: 750rpx;
		padding: 0 40rpx;
		margin-bottom: 40rpx;
		display: flex;
		align-items: center;
	}

	.info_xx image {
		height: 36rpx;
		width: 32rpx;
		margin-right: 20rpx;
	}

	/* 边线 */
	.info_border {
		width: 690rpx;
		margin: 0 30rpx;
		height: 2rpx;
		background-color: #eeeeee;
	}

	/* 精医名院 */
	.bright {
		padding: 0rpx 30rpx;
		width: 750rpx;
		margin-top: 70rpx;
	}

	.bright_title {
		display: flex;
		align-items: center;
		margin-bottom: 44rpx;
	}

	.bright_title view {
		height: 14rpx;
		width: 14rpx;
		border-radius: 7rpx;
		background-color: #6ccbb6;
		margin-right: 20rpx;
	}

	.bright_info {
		width: 690rpx;
		display: flex;
		justify-content: space-between;
	}

	.bright_bos {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.bright_box {
		width: 120rpx;
		height: 120rpx;
		border-radius: 60rpx;
		background-color: #ffffff;
		box-shadow: 0px 0px 50rpx 0px rgba(213, 213, 213, 0.5);
		display: flex;
		justify-content: center;
		align-items: center;
		margin-bottom: 50rpx;
	}

	.bright_box image {
		width: 50rpx;
		height: 50rpx;
	}

	/* 本院介绍 */
	.introduce {
		color: #6a6a6a;
		font-size: 26rpx;
		line-height: 36rpx;
	}

	.padding_bottom {
		padding-bottom: 140rpx;
	}

	.rich-img {
		width: 700rpx !important;
	}
</style>
